<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8">
		<title>中科慧联</title>
		<meta name="viewport" content="width=device-width, 
                                     initial-scale=1.0, 
                                     maximum-scale=1.0, 
                                     user-scalable=no">
        <link href='https://fonts.googleapis.com/css?family=Open+Sans:400,700' rel='stylesheet' type='text/css'>
		<link rel="shortcut icon" href="img/Title.png">
		<!-- 包含 bootstrap 样式表 -->
		<link rel="stylesheet" href="https://apps.bdimg.com/libs/bootstrap/3.2.0/css/bootstrap.min.css">
		<link href="fonts/FontAwesome/font-awesome.css" rel="stylesheet">
		<link href='https://fonts.googleapis.com/css?family=Open+Sans:400,700' rel='stylesheet' type='text/css'>
		<link href="css/animate.css" rel="stylesheet">
		<link href="css/bootsnav.css" rel="stylesheet">
		<link rel="stylesheet" type="text/css" href="css/htmleaf-demo.css">
		<link href="css/overwrite.css" rel="stylesheet">
	    <link href="css/style.css" rel="stylesheet">
	    <link rel="stylesheet" type="text/css" href="css/productservice.css"/>
	    <link rel="stylesheet" href="css/swiper-3.4.2.min.css" />
	    <style type="text/css">
	    	.swiper-container {
			    width: 100%;
			    height: 300px;
			}  
			.swiper-button-prev, .swiper-container-rtl .swiper-button-next{
				background-image: url(img/ps/left.png);
				background-size:25px ;
				
			}
			.swiper-button-next, .swiper-container-rtl .swiper-button-prev{
				background-image: url(img/ps/right.png);
				background-size:25px ;
				left: 50px;
			}
			.swiper-pagination{
				color: #ef2a00;
			}
			.swiper-button-next{
				top: 83%;
				left:25%;
			}
			.swiper-button-prev{
				top:83%;
				left:22%;
			}
			.swiper-container-horizontal>.swiper-pagination-bullets, .swiper-pagination-custom, .swiper-pagination-fraction  {
				bottom: 60px;
			    left: 600px;
			}
    		.rows{
    			display: none;
    		}
    		.bac{
    			background: #f9f9f9;
    		}
    		#triangle-right {
			    width: 0;
			    height: 0;
			    border-top: 50px solid transparent;
			    border-left: 100px solid red;
			    border-bottom: 50px solid transparent;
			}
			.padding-top30{
				padding-top: 30px;
			}
			.navbar.bootsnav ul.nav > li > a{
	    		font-size: 16px;
	    	}
	    	.swiper-pagination{
	    		font-size: 22px;
	    	}
	    	.swiper-pagination-current{
				color: red;
				font-size: 22px;
				font-weight: 600;
			}
			.swiper-pagination-total{
				color:#000;
				font-size: 18px;
				
			}
			.span8{
				font-size: 18px;
			}
	    </style>
	</head>

	<body>
		
		<!--hedaer 导航-->
		<header class="header" style="padding-top: 10px;">
			<div class="header-wrapper">
				<div class="container">
					<div class="row">
						<!--导航-->
						<nav class="navbar navbar-default navbar-sticky bootsnav">

							<!-- End Top Search -->

							<div class="container">
								<!-- Start Atribute Navigation -->
								<div class="attr-nav">

								</div>
								<!-- End Atribute Navigation -->

								<!-- Start Header Navigation -->
								<div class="navbar-header">
									<img style="width: 90%; padding-top: 5px;"src="img/logo.png" class="img-responsive">
								</div>
								<!-- End Header Navigation -->

								<!-- Collect the nav links, forms, and other content for toggling -->
								<div class="collapse navbar-collapse" id="navbar-menu">
									<ul class="nav navbar-nav navbar-right" data-in="fadeInDown" data-out="fadeOutUp">
										<li>
											<a href="index.html">首页</a>
										</li>
										<li>
											<a href="ProductService.html">产品与服务</a>
										</li>
										<li>
											<a href="Solution.html">解决方案</a>
										</li>
										<li>
											<a href="TechnicalSupport.html">技术支持</a>
											
										</li>
										<li>
											<a href="information.html">资讯中心</a>
										</li>
										<li>
											<a href="AboutUs.html">关于慧联</a>
										</li>
										<li>
											<a href="http://cloud.ic-iot.com/login.html" target="_blank">云&nbsp;平&nbsp;台</a>
										</li>
									</ul>
								</div>
								<!-- /.navbar-collapse -->
							</div>
						</nav>
					</div>
					<!--.row -->
				</div>
			</div>
			<!-- .header-wrapper -->
		</header>
		<!--轮播-->
		<div class="ms-fullscreen-template" id="slider1-wrapper" style="padding-top: 10px;">
			<!-- masterslider -->
			<div class="master-slider ms-skin-default" id="masterslider">
				<div class="swiper-container" style="height: 426px; background: url(img/ps/PS_bg.jpg) no-repeat 100%">
				    <div class="swiper-wrapper">
				        <div class="swiper-slide"><img class="img_ban" src="img/ps/181.png"></div>
				        <div class="swiper-slide"><img class="img_ban" src="img/ps/179.png"></div>
				        <div class="swiper-slide"><img class="img_ban" src="img/ps/180.png"></div>
				        <div class="swiper-slide"><img class="img_ban" src="img/ps/182.png"></div>
				    </div>
				    <!-- 如果需要分页器 -->
				    <div class="swiper-pagination"></div>
				    
				    <!-- 如果需要导航按钮 -->
				    <div class="swiper-button-prev"></div>
				    <div class="swiper-button-next"></div>
				    
				</div>
				<div class="ms-slide slide-5" data-delay="10" >
				</div>
			</div>
			<!-- end of masterslider -->
		</div>
		<!-- 产品与服务 -->
		<div class="container-fluid padding-clear">
		    <div class="solution">
		        <div class="page-header text-center">
		            <h3>PRODUCTS&SERVICES<small></span>&nbsp;产品与服务&nbsp;</small></h3>
		           <div class="clearfix">
						<ul class="title title1 left">
							<li id="btn_li_1" class='cur'>智能硬件</li>
							<li id="btn_li_2">硬件模块</li>
							<li id="btn_li_3">云服务</li>
							<li id="btn_li_4">数据平台</li>
							<li id="btn_li_5">APP开发</li>
						</ul>
					</div>
		        </div>
		        <div>
		        	<!--硬件-->
			        <div id="row_1">	
			            <div class="span8" style="background:url(img/ps/INTELLIGENT--CONNECTION.png) no-repeat center 0; height: 70px; text-align: center; font-weight: 600; margin-bottom: 30px;">
			            	<img src="img/ps/zhineng.png" /></br>——&nbsp;智能硬件&nbsp;——
			            </div>
			            <div class="black">
			            	<div style="width: 1300px; margin: 0 auto;">
			            		<div style=" float: left;"><img src="img/888/GPRS_02.png"/></div>
			            	</div>
			            </div>
			            <div class="black">
			            	<div class="padding-top30" style="text-align: center;"><img src="img/ps/147.png"/></div>
			            </div>
			            <div class="white">
			            	<img src="img/888/GPRS_01.png"/>
			            </div>
			            <div class="white">
			            	
			            	<img src="img/ps/149.png"/>
			            </div>
			            <div class="black">
			            	<div style="width: 1300px; margin: 0 auto;">
			            		<div style=" float: left;"><img src="img/888/wifi_01.png"/></div>
			            	</div>
			            </div>
			            <div class="black">
			           		<div style="text-align: center;"><img src="img/ps/150.png"/></div>
			            </div>
			            <div class="white">
			            	<img src="img/888/wifi_02.png"/>
			            </div>
			            <div class="white">
			            	<img src="img/ps/151.png"/>
			            </div>
			            <div class="black">
			            	<div style="width: 1300px; margin: 0 auto;">
			            		<div style=" float: left;"><img src="img/888/bt_01.png"/></div>
			            	</div>
			            </div>
			            <div class="black">
			           		<div style="text-align: center;"><img src="img/ps/152.png"/></div>
			            </div>
			            <div class="white">
			            	<img src="img/ps/153.png"/>
			            </div>
			            <div class="black">
			            	<div style="width: 1300px; margin: 0 auto;">
			            		<div style=" float: left;"><img src="img/888/icth03_01.png"/></div>
			            	</div>
			            </div>
			            <div class="black">
			           		<div style="text-align: center;"><img src="img/ps/154.png"/></div>
			            </div>
			            <div class="white">
			            	<img src="img/888/icth03_02.png"/>
			            </div>
			            <div class="white">
			            	<img src="img/ps/155.png"/>
			            </div>
			        </div>
			        <!--硬件模块-->
			        <div class="rows" id="row_2" >	
			            <div class="span8" style="background:url(img/ps/INTELLIGENT--CONNECTION.png) no-repeat center 0; height: 70px; text-align: center; font-weight: 600; margin-bottom: 30px;">
			            	<img src="img/ps/yingjian/mokuai.png" /></br>——&nbsp;硬件模块&nbsp;——
			            </div>
			            <div class="row" style="margin: 20px; width: 1300px; margin: 0 auto;">
			            	<p style="margin: 40px; text-align: left;">
			            		&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; 中科慧联依靠自身在技术和产品研发方面的优势，打造智能硬件供应链服务，致力于打通IoT创新创业者与制造全产业链的各个环节，提供智能硬件
								定制化服务，降低开发成本，缩短开发周期，助力企业产业升级。为IoT创新创业者提供9项C2M专业级定制服务，助力用户将创意变成产品。速发展。
							</p>
						</div>
			            <div class="bac" style="padding: 20px 0;">
			            	<h3 style="margin: 0 auto;width: 1300px; text-align: center;"><img src="img/Solution/01/border.jpg"/>&nbsp;&nbsp;R & D &nbsp;&nbsp;<img src="img/Solution/01/border.jpg"/></br><span style="font-size: 18px;">研发环节</span></h3>
			            	<div class="padding-top30" style="text-align: center;"><img src="img/ps/yingjian/170.png"></div>
			            </div>
			            <div class="white">
			            	<h3 style="margin: 0 auto; width: 1300px; text-align: center;"><img src="img/Solution/01/border.jpg"/>&nbsp;&nbsp;Smart Device&nbsp;&nbsp;<img src="img/Solution/01/border.jpg"/></br><span style="font-size: 18px;">智能硬件</span></h3>
							<div style="display: flex; justify-content:center;">
								<dl class="dl">
									<dt><img src="img/ps/yingjian/duixiang.png"/></dt>
									<dd>物联网 LoRa模组</dd>
								</dl>
								<dl class="dl">
									<dt><img src="img/ps/yingjian/wifi.png"/></dt>
									<dd>物联网 WI-FI模组</dd>
								</dl>
								<dl class="dl">
									<dt><img src="img/ps/yingjian/17.png"/></dt>
									<dd>物联网GPRS模组</dd>
								</dl>
							</div>
							<div style="display: flex; justify-content:center;">
								<dl class="dl">
									<dt style="width: 280px;"><img src="img/ps/yingjian/ru.png"/></dt>
									<dd>基于GPRS的数据采集器</dd>
								</dl>
								<dl class="dl">
									<dt><img src="img/ps/yingjian/caiji.png"/></dt>
									<dd>基于WI-FI的数据采集器</dd>
								</dl>
							</div>
			            </div>
			        </div>
			        <!--云服务-->
			        <div class="rows" id="row_3" >	
			            <div class="span8" style="background:url(img/ps/INTELLIGENT--CONNECTION.png) no-repeat center 0; height: 70px; text-align: center; font-weight: 600; margin-bottom: 30px;">
			            	<img src="img/ps/fuwu/pan.png" /></br>——&nbsp;云服务&nbsp;——
			            </div>
			            <div style="margin: 20px; width: 1300px; margin: 0 auto; padding: 50px 0;">
			            	<h3 style="margin: 30px auto; width: 1300px; text-align: center;"><img src="img/Solution/01/border.jpg"/>&nbsp;&nbsp;Cloud Platform&nbsp;&nbsp;<img src="img/Solution/01/border.jpg"/></br><span style="font-size: 18px;">慧联"云"</span></h3>
			            	<div style="text-align: center;"><img src="img/ps/fuwu/148.png"/></div>
			            	<p style="margin: 20px; width: 1300px; text-align: center;">中科慧联自主研发物联网云平台，可支持百万级节点的实时连接，用户采用具有慧联Agent协议的物联网通信模块，可快速实现物联网设备入网、数据传输及数据挖掘等功能。</p>
						</div>
			            <div style="margin: 20px; width: 1300px; margin: 0 auto; padding: 50px 0;">
			            	<h3 style="margin: 30px auto; width: 1300px; text-align: center;"><img src="img/Solution/01/border.jpg"/>&nbsp;&nbsp;Characteristics&nbsp;&nbsp;<img src="img/Solution/01/border.jpg"/></br><span style="font-size: 18px;">慧联"云"特点</span></h3>
			            	<div style="text-align: center;"><img src="img/ps/fuwu/yunfuwu.jpg"/></div>
			            </div>
			            <div style="margin: 20px; width: 100%; margin: 0 auto; background: #f9f9f9; padding: 50px 0;">
			            	<h3 style="margin: 30px auto; width: 1300px; text-align: center;"><img src="img/Solution/01/border.jpg"/>&nbsp;&nbsp;Service Area&nbsp;&nbsp;<img src="img/Solution/01/border.jpg"/></br><span style="font-size: 18px;">服务领域</span></h3>
			            	<div style="text-align: center;"><img src="img/ps/fuwu/lingyu.jpg"/></div>
			            </div>
			            <div style="margin: 20px; width: 1300px; margin: 0 auto; padding: 50px 0;">
			            	<h3 style="margin: 30px auto; width: 1300px; text-align: center;"><img src="img/Solution/01/border.jpg"/>&nbsp;&nbsp;Service Content&nbsp;&nbsp;<img src="img/Solution/01/border.jpg"/></br><span style="font-size: 18px;">服务内容</span></h3>
			            	<div style="text-align: center;"><img src="img/ps/fuwu/182.png"/></div>
			            </div>
			        </div>
			        <!--数据平台-->
			        <div class="rows" id="row_4" >	
			            <div class="span8" style="background:url(img/ps/INTELLIGENT--CONNECTION.png) no-repeat center 0; height: 70px; text-align: center; font-weight: 600; margin-bottom: 30px;">
			            	<img src="img/shuju/shuju.png" /></br>——&nbsp;数据平台&nbsp;——
			            </div>
			            <div class="row" style="margin: 20px; width: 1300px; margin: 0 auto;">
			            	<p style="margin: 40px; text-align: left;">
			            		&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;中科慧联凭借多年的软件开发及行业经验，建立了完备的数据平台系统设计体系，根据我们在实践中总结出的一整套设计流程、方法和工具，为用户提供大数据决策系
								统的分析设计、交互设计、视觉设计服务，为用户专属打造精准、有效的高品质数据平台可视化方案，帮助客户推动企业信息化管理建设，提升管理决策水平；在业务方面，
								公司可协助客户挖掘数据的价值，逐步实现企业信息化转型。
							</p>
						</div>
						<div class="white">
							<div style="display: flex; justify-content:center; padding: 50px 0;">
								<img src="img/shuju/185.png"/>
							</div>
			            </div>
			            <div class="white">
			            	<h3 style="margin: 0 auto; width: 1300px; text-align: center;"><img src="img/Solution/01/border.jpg"/>&nbsp;&nbsp;Service Process&nbsp;&nbsp;<img src="img/Solution/01/border.jpg"/></br>服务流程</h3>
						</div>
						 <div class="bac" style="padding: 20px 0;">
			            	<div style="display: flex; justify-content:center; padding: 50px 0;">
								<img src="img/shuju/186.png"/>
							</div>
			            </div>
			            <div class="white">
							<div style="display: flex; justify-content:center; padding: 50px 0;">
								<img src="img/shuju/187.png"/>
							</div>
			            </div>
			             <div class="bac" style="padding: 20px 0;">
			            	<div style="display: flex; justify-content:center; padding: 50px 0;">
								<img src="img/shuju/188.png"/>
							</div>
			            </div>
			        </div>
			        <!--APP 开发-->
			        <div class="rows" id="row_5" >	
			            <div class="span8" style="background:url(img/ps/INTELLIGENT--CONNECTION.png) no-repeat center 0; height: 70px; text-align: center; font-weight: 600; margin-bottom: 30px;">
			            	<img src="img/ps/app/APP.png" /></br>——&nbsp;APP开发&nbsp;——
			            </div>
			            <div class="row" style="margin: 20px; width: 1300px; margin: 0 auto;">
			            	<p style="margin: 40px; text-align: left;">
			            		&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;青岛中科慧联科技有限公司核心技术及后台算法，专业承接物联网APP定制，通过严格管理规范和专业化服务为客户提供优质的手机App研发服务。中科慧联App开发
								核心服务包括：智能硬件配套的手机App开发，Android软件开发，iPhone/iPad软件开发等。
							</p>
						</div>
			            <div class="bac" style="padding: 20px 0;">
			            	<h3 style="padding:20px 0;margin: 0 auto; width: 1300px; text-align: center;"><img src="img/Solution/01/border.jpg"/>&nbsp;&nbsp;service area &nbsp;&nbsp;<img src="img/Solution/01/border.jpg"/></br><span style="font-size: 18px;">服务范围</span></h3>
			            	<div style="text-align: center;">
			            		<img src="img/ps/app/19.png">
			            		<h5 style="padding: 20px 0;">ios定制开发</h5>
			            		<p style=" margin: 40px auto; width: 1300px; text-align:center;">
			            			&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;中科慧联IOS  APP应用开发服务针对Apple iOS环境下的iPhone、iPad、MAC等平台的商业应用开发，为广大客户带来企业品牌推广、企业移动电子商务以及娱乐、
									游戏、生活等各类APP应用服务，帮助企业实现移动信息化战略布局。</p>
			            	</div>
			            </div>
			            <div class="white" style="display: flex; justify-content:center; margin: 50px 0;">
			            	<div style="width: 240px;">
			            		<ul >
			            			<li class="tab_lis" id="tab_btn1">
			            				<dl>
			            					<dt><img src="img/ps/app/jiagou.png"/></dt>
			            					<dd>IOS系统架构分层</dd>
			            				</dl>
			            			</li>
			            			<li class="tab_li" id="tab_btn2">
			            				<dl>
			            					<dt><img src="img/ps/app/kaifa.png"/></dt>
			            					<dd>IOS应用开发环境</dd>
			            				</dl>
			            			</li>
			            			<li class="tab_li" id="tab_btn3">
			            				<dl>
			            					<dt><img src="img/ps/app/youshi.png"/></dt>
			            					<dd>IOS应用开发优势</dd>
			            				</dl>
			            			</li>
			            		</ul>
			            	</div>
		            			<dl id="ios1" style="width: 500px; margin: 100px 0;">
		            				<dt style="text-align:left;font-size: 22px; font-weight: 600; padding-bottom: 20px; line-height: 50px;"><span style="border-bottom: 1px solid #9fc3c8;">IOS系</span>统架构分为四个层次</dt>
		            				<dd style="text-align:left;">
			            				核心操作系统层(the Core OS layer)</br>
										核心服务层(the Core Services layer)</br>
										媒体层(the Media layer)</br>
										可轻触层(the Cocoa Touch layer)</br>
										系统操作占用大概240MB的存储器空间。</br>
									</dd>
		            			</dl>
		            			<dl class="rows" id="ios2" style="width: 500px; margin: 100px 0;">
		            				<dt style="text-align:left;font-size: 22px; font-weight: 600; padding-bottom: 20px; line-height: 50px;"><span style="border-bottom: 1px solid #9fc3c8;">IOS应</span>用程序开发环境</dt>
		            				<dd style="text-align:left;">
			            				Xcode 开发者工具应有尽有，创建 Mac、iPhone 以及 
										iPad 应用程序所需的一切工具，尽都包含其中。通过与 Cocoa
										 和 Cocoa Touch 框架紧密结合， Xcode 为您创建一个具
										有高效产出且易于使用的开发环境。
									</dd>
		            			</dl>
		            			<dl class="rows" id="ios3" style="width: 500px; margin: 100px 0;">
		            				<dt style="text-align:left;font-size: 22px; font-weight: 600; padding-bottom: 20px; line-height: 50px;"><span style="border-bottom: 1px solid #9fc3c8;">IOS应</span>用开发优势</dt>
		            				<dd style="text-align:left;">
		            					开发周期短：在开发期间，iPhone开发团队加倍投入人力，
										尽可能的缩短开发周期，以保证产品的纳期。
										测试力度大：iPhone应用测试团队来负责软件的功能测试，
										压力测试等工作，以确保产品的质量。
										技术力量强：我们拥有一群有才华的iPhone应用开发专家，
										以及移动互联设备用户体验专家，提供远超客户预期的最
										先进的应用。
									</dd>
		            			</dl>
			            	<div>
			            		<img style="float: right;" src="img/ps/app/iPhone.png"/>
			            	</div>
			            </div>
			            <div class="bac" style="padding: 20px 0;">
			            	<div style="padding-top: 30px; text-align: center;">
			            		<img src="img/ps/app/20.png">
			            		<h5 style="padding: 20px 0;">Android定制开发</h5>
			            		<p style=" margin: 40px; text-align:center;">
			            			中科慧联安卓（Android）APP 定制开发借助建立标准化、开放式的移动电话软件平台，在移动产业内形成一个开放式的生态系统。
			            		</p>
			            	</div>
			            </div>
			            <div style="display: flex; justify-content:center; padding: 80px 0;">
							<img src="img/ps/app/165.png"/>
							<div style="width: 530px; padding: 10px 20px;">
								<dl>
									<dt style="font-size: 16px; font-weight: 600;">Android应用程序的开发环境</dt>
									<dd style="padding-top:30px ;">安卓Android应用程序开发是用Java语言编写的，所以结合Eclipse的
									     Android Developer Tools插件就可开发Android应用程序。
									</dd>
								</dl>
								<dl style="padding-top: 30px;">
									<dt style="font-size: 16px; font-weight: 600;">我们的Android应用开发优势</dt>
									<dd style="padding-top:30px ;">开发周期短：在开发期间，安卓开发团队都会加倍投入人力，尽可能的
										缩短开发周期，以保证产品的纳期。</br>
										测试力度大：我们拥有专门的安卓测试团队来负责软件的功能测试，压
										力测试等工作，以确保产品的质量。</br>
										技术力量强：我们拥有一群有才华的安卓开发专家，以及移动互联设备
										用户体验专家，提供远超客户预期的最先进的应用。
									</dd>
								</dl>
							</div>
						</div>
						<div class="white">
			            	<h3 style="margin: 0 auto; width: 1300px; text-align: center;"><img src="img/Solution/01/border.jpg"/>&nbsp;&nbsp;Smart Device&nbsp;&nbsp;<img src="img/Solution/01/border.jpg"/></br>智能硬件</h3>
							<div style="display: flex; justify-content:center; padding: 50px 0;">
								<img src="img/ps/app/166.png"/>
							</div>
			            </div>
			        </div>
		        </div>
		       
		    </div>
		</div>
		
				<!--底部-->
		<div class="footer" style="display:flex; justify-content: space-around;">
        	<div>
        		<ul class="foot_ul">
        			<li><img src="img/logo_bot.png"/></li>
        			<li style="padding-top: 10px;">青岛中科慧联信息科技有限公司</li>
        			<li style="padding-top: 10px;">Intelligent IoT System Solutions Provider！</li>
        			<li>智能化物联网系统解决方案提供商</li>
        			<li style="padding-top: 10px;">青岛总部：青岛市高新区智力岛路1号B座25楼</li>
        			<li>北京分部：北京市海淀区中关村东路95号智能化大厦11层</li>
        			<li>Copyright © 2014-2017 | 鲁ICP备17002802号-1</li>
        		</ul>
        	</div>
        	<div>
        		<img style="float: left;padding-top: 30px;" src="img/erweima.png"/>
        		<ul class="footer_ul" style="float: left; padding-top: 10px;">
        			<li style="font-size: 18px;">联系我们</li>
        			<li>公司电话：0532-68013716</li>
        			<li>公司邮箱：company@ic-iot.com</li>
        			<li>技术支持：support@ic-iot.com</li>
        			<li>销售邮箱：sales@ic-iot.com</li>
        		</ul>
        	</div>
	    </div>
		<div class="gototop js-top">
			<a href="https://shop215545486.taobao.com/">
				<i><img style="width: 30px;" src="img/taobao.png"/></i>
			</a>
			<a href="#" id="top_btn">
				<i><img style="width: 30px;" src="img/top.png"/></i>
			</a>
		</div>
		<!-- JavaScript -->
		<script src="https://cdn.bootcss.com/jquery/2.1.1/jquery.min.js"></script>
		<script>window.jQuery || document.write('<script src="js/jquery-1.11.0.min.js"><\/script>')</script>
		<script src="https://apps.bdimg.com/libs/bootstrap/3.2.0/js/bootstrap.min.js"></script>
		<script src="js/common.js" type="text/javascript" charset="utf-8"></script>
		<script src="js/bootsnav.js"></script>
		<script src="js/swiper-3.4.2.jquery.min.js"></script>
		<script>
			var mySwiper = new Swiper ('.swiper-container', {
				autoplay:5000,
			    direction: 'vertical',
			    loop: true,
			    direction:'horizontal',
			    grabCursor : true,
			    roundLengths : true, 
			    paginationType : 'fraction',
			    // 如果需要分页器
			    pagination: '.swiper-pagination',
			   
			    // 如果需要前进后退按钮
			    nextButton: '.swiper-button-next',
			    prevButton: '.swiper-button-prev',
			    
			})    
			$("#btn_li_1").click(function(){
				$("#btn_li_1").addClass("cur");
				$("#btn_li_1").siblings().removeClass("cur");
				$("#row_2").addClass("rows");
				$("#row_3").addClass("rows");
				$("#row_4").addClass("rows");
				$("#row_5").addClass("rows");
				$("#row_1").removeClass("rows")
			});
			$("#btn_li_2").click(function(){
				$("#btn_li_2").addClass("cur");
				$("#btn_li_2").siblings().removeClass("cur");
				$("#row_1").addClass("rows");
				$("#row_3").addClass("rows");
				$("#row_4").addClass("rows");
				$("#row_5").addClass("rows");
				$("#row_2").removeClass("rows")
			});
			$("#btn_li_3").click(function(){
				$("#btn_li_3").addClass("cur");
				$("#btn_li_3").siblings().removeClass("cur");
				$("#row_1").addClass("rows");
				$("#row_2").addClass("rows");
				$("#row_4").addClass("rows");
				$("#row_5").addClass("rows");
				$("#row_3").removeClass("rows")
			});
			$("#btn_li_4").click(function(){
				$("#btn_li_4").addClass("cur");
				$("#btn_li_4").siblings().removeClass("cur");
				$("#row_1").addClass("rows");
				$("#row_4").removeClass("rows");
				$("#row_3").addClass("rows");
				$("#row_2").addClass("rows");
				$("#row_5").addClass("rows");
			});
			$("#btn_li_5").click(function(){
				$("#btn_li_5").addClass("cur");
				$("#btn_li_5").siblings().removeClass("cur");
				$("#row_1").addClass("rows");
				$("#row_3").addClass("rows");
				$("#row_4").addClass("rows");
				$("#row_2").addClass("rows");
				$("#row_5").removeClass("rows")
			});
			$("#tab_btn1").click(function(){
				$("#tab_btn1").addClass("tab_lis");
				$("#tab_btn1").siblings().removeClass("tab_lis");
				$("#ios3").addClass("rows");
				$("#ios2").addClass("rows");
				$("#ios1").removeClass("rows")
			});
			$("#tab_btn2").click(function(){
				$("#tab_btn2").addClass("tab_lis");
				$("#tab_btn2").siblings().removeClass("tab_lis");
				$("#tab_btn2").siblings().addClass("tab_li");
				$("#ios3").addClass("rows");
				$("#ios1").addClass("rows");
				$("#ios2").removeClass("rows")
			});
			$("#tab_btn3").click(function(){
				$("#tab_btn3").addClass("tab_lis");
				$("#tab_btn3").siblings().removeClass("tab_lis");
				$("#tab_btn3").siblings().addClass("tab_li");
				$("#ios2").addClass("rows");
				$("#ios1").addClass("rows");
				$("#ios3").removeClass("rows")
			});
		</script>
	</body>
</html>